<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
    <meta charset="UTF-8"/>
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/> 
		<meta name="viewport" content="width=device-width, initial-scale=1.0"/> 
		<title>Editar Local</title>
		<link rel="shortcut icon" href="../favicon.ico"/>
		<link rel="stylesheet" type="text/css" href="css/default.css"/>
                <link rel="stylesheet" type="text/css" href="css/component.css"/>
                <link rel="stylesheet" type="text/css" href="css/panel.css"/>
                <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Playfair+Display:400italic' rel='stylesheet' type='text/css' />
                <link href='http://fonts.googleapis.com/css?family=Titillium+Web:400,300' rel='stylesheet' type='text/css'/>
		<script src="js/modernizr.custom.js"></script>
                <script src="http://maps.google.com/maps/api/js?sensor=false"
                        type="text/javascript"></script>
    </h:head>
    <h:body class="cbp-spmenu-push">
        <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left" id="cbp-spmenu-s1">
                <h3>BirrApp</h3>
                <a href="ok.xhtml" id="inicio">Inicio</a>
                <a href="buscar.xhtml" id="buscar" onclick="menuItem('buscar');">Buscar</a>
                <a href="favoritos.xhtml" id="favoritos" onclick="menuItem('favoritos');">Favoritos</a>
                <a href="perfil.xhtml" id="perfil" onclick="menuItem('perfil');">Perfil</a>
                <h:form> 
                    <h:commandLink action="#{endSessionManagedBean.disconect()}" value="Desconectar"/>
                </h:form>

        </nav>
        <div class="container" >
            <div class="main" id="frame">  
                <p:messages id="messages" showDetail="false" autoUpdate="true"/> 
                <h1>Editar Local</h1>
                <p:fieldset legend="#{perfilEditarManagedBean.barUsuarioT.baresT.nombre}">
                    <h:form id="form1" prependId="false" >
                    <h:panelGrid id="tablaDatosPadre" columns="2" cellpadding="10" columnClasses="barList11, barList14">   
                        
                        <h:panelGrid columns="1" id="tablaFoto">  
                            <h:form id="formImagen">
                            <p:graphicImage id="barImagen" styleClass="imageBarDetalle" 
                                            value="#{perfilEditarManagedBean.fotoBar}"/>  
                            </h:form>
                            <p:commandLink id="dialogAmpliar" value="Ampliar" onclick="barImage.show();"/> 
                            <p:dialog widgetVar="barImage" showEffect="clip"
                                      hideEffect="clip" modal="true" resizable="false">
                                <p:graphicImage id="barImg"
                                            value="#{perfilEditarManagedBean.fotoBar}"/>
                                 
                             </p:dialog>
                            
                            <p:commandButton id="cambiarFotoButton" value="Cambiar Foto" onclick="dlg1.show();"></p:commandButton>
                              <p:dialog id="dialogCambiar" header="Insertar imagen (Recomendado formato panorámico)" widgetVar="dlg1">  
                               <h:form id="formfoto" enctype="multipart/form-data">
                                    <p:messages showDetail="true"/> 
                                    <p:fileUpload id="fileupload" mode="advanced" fileUploadListener="#{perfilEditarManagedBean.handleFileUpload}" 
                                                  allowTypes="/(\.|\/)(gif|jpg|jpeg|gif|png|PNG|GIF|JPG|JPEG)$/" multiple="false"
                                                  cancelLabel="Cancelar" uploadLabel="Subir" label="Elegir" />

                                 </h:form>
                           </p:dialog> 
                        </h:panelGrid>  
                        
                        <h:panelGrid id="tablaDatos" columns="2" cellpadding="5">   
                            <h:outputText value="Nombre: " styleClass="letrasNegrita"/>
                            <p:inplace id="ajaxInplace1" editor="true" > 
                                <p:inputText value="#{perfilEditarManagedBean.barUsuarioT.baresT.nombre}" required="true" requiredMessage="Se requiere un nombre"/>
                            </p:inplace>

                            <h:outputText value="Dirección: " styleClass="letrasNegrita"/>
                            <p:inplace id="ajaxInplace2" editor="true" > 
                                <p:inputText value="#{perfilEditarManagedBean.barUsuarioT.baresT.direccion}" required="true" requiredMessage="Se requiere una dirección"/>
                            </p:inplace>

                            <h:outputText value="Código Postal: " styleClass="letrasNegrita"/>
                            <p:inplace id="ajaxInplace3" editor="true" > 
                                <p:inputText value="#{perfilEditarManagedBean.barUsuarioT.baresT.codigoPostal}" required="true" requiredMessage="Se requiere un código postal"/>
                            </p:inplace>
                            

                            <h:outputText value="Teléfono: " styleClass="letrasNegrita"
                                          rendered="#{perfilEditarManagedBean.isTelefono}"/>
                            <p:inplace id="ajaxInplace4" editor="true" > 
                                <p:inputText value="#{perfilEditarManagedBean.barUsuarioT.baresT.telefono}"
                                             rendered="#{perfilEditarManagedBean.isTelefono}" required="true" requiredMessage="Se requiere un número de teléfono"/> 
                            </p:inplace>
                            
                           
                             
                                
                                <p:commandButton id="openDialogLink2" value="Mostar en mapa" onclick="map.show()"
                                                 disabled="#{perfilEditarManagedBean.barUsuarioT.baresT.latitud == null}"/>
                                <p:commandButton id="openDialogLink3" value="Situe su local" onclick="map2.show()"/>
                                
                               
                                
                               
                        </h:panelGrid>
                        
                     </h:panelGrid> 
                        <div  class="buttonPerfil">
                                    <p:commandButton id="botonActualizarLocal" value ="Actualizar" action="#{perfilEditarManagedBean.updateLocal()}"/>
                        </div>
                    </h:form>
                    
                    <p:dialog id="picture" widgetVar="map" header="Ubicación #{perfilEditarManagedBean.barUsuarioT.baresT.nombre}" width="800" height="500"  
                              showEffect="clip" hideEffect="clip" modal="true" resizable="false">  
                        <p:ajax event="close"/>  
                        <p:gmap id ="mapaLocalizar" zoom="16" type="HYBRID" center="#{perfilEditarManagedBean.centerLatitude},#{perfilEditarManagedBean.centerLongitude}" 
                                model="#{perfilEditarManagedBean.advancedModel}" style="width:100%;height:100%">  
                            <p:ajax event="overlaySelect" listener="#{perfilEditarManagedBean.onMarkerSelect}" />  
                            <p:gmapInfoWindow>  
                                <p:outputPanel style="text-align:center;display:block;margin:auto:">  
                                        <p:graphicImage value="#{perfilEditarManagedBean.marker.data}" styleClass="imageBarDetalle"/>  
                                        <br />  
                                        <h:outputText value="#{perfilEditarManagedBean.marker.title}" />  
                                </p:outputPanel>  
                            </p:gmapInfoWindow>  
                        </p:gmap>
                    </p:dialog>


                    <p:dialog id="picture2" widgetVar="map2" header="Seleccione un punto en el mapa para situar '#{perfilEditarManagedBean.barUsuarioT.baresT.nombre}'" width="800" height="500"  
                              showEffect="clip" hideEffect="clip" modal="true" resizable="false"> 

                        <p:gmap id="mapaUbicar" center="37.387432,-5.979044" zoom="13" type="HYBRID"   
                            style="width:100%;height:100%" 
                            model="#{perfilEditarManagedBean.emptyModel}"   
                            onPointClick="handlePointClick(event);"   
                            widgetVar="mapUbicar" /> 

                        <p:dialog widgetVar="dlg" showEffect="fade" header="¿Es esta la ubicación?" closable="false"  resizable="false">  
                                <h:form prependId="false">  
                                    <h:panelGrid columns="2">  
                                        <f:facet name="footer">  
                                            <p:commandButton value="OK"          
                                                    oncomplete="markerAddComplete()"/>  
                                            <p:commandButton value="Cancelar" onclick="return cancel()"/>  
                                        </f:facet>  
                                    </h:panelGrid>  

                                    <h:inputHidden id="lat" value="#{perfilEditarManagedBean.lat}" />  
                                    <h:inputHidden id="lng" value="#{perfilEditarManagedBean.lng}" />  
                                </h:form>  
                         </p:dialog> 
                    </p:dialog>


                    <script type="text/javascript">  
                        var currentMarker = null;  

                        function handlePointClick(event) {  
                            if(currentMarker === null) {  
                                document.getElementById('lat').value = event.latLng.lat();  
                                document.getElementById('lng').value = event.latLng.lng();  

                                currentMarker = new google.maps.Marker({  
                                    position:new google.maps.LatLng(event.latLng.lat(), event.latLng.lng())  
                                });  

                                mapUbicar.addOverlay(currentMarker);  

                                dlg.show();  
                            }     
                        }  

                        function markerAddComplete() {  

                            dlg.hide();  
                        }  

                        function cancel() {  
                            dlg.hide();  
                            currentMarker.setMap(null);  
                            currentMarker = null;  

                            return false;  
                        }  
                    </script>  
                
                </p:fieldset>
                
                 
                <p:fieldset id="fieldListaCervezas" legend="Cervezas">
                   <h:form id="formListaCervezas" prependId="false" >
                        <p:dataTable id="dataTableBarContenido" var="cervezaContenido" 
                                     value="#{perfilEditarManagedBean.listaCervezas}" 
                                     styleClass="listasCervezasTabla"
                                     paginator="true" rows="4"
                                     rowStyleClass="#{cervezaContenido.precio eq tablaBaresTManagedBean.getcervezaMasBarataEnBar(cervezaContenido) ? 'colorRowMasBarata' : null}"
                                     emptyMessage="No dispone de cervezas." paginatorAlwaysVisible="false">
                           <p:column headerText="Marca" styleClass="barList21" >  
                               <h:outputText value="#{cervezaContenido.cervezasT.marca}"/>  
                           </p:column>

                           <p:column headerText="Tipo" styleClass="barList22">  
                               <h:outputText value="#{cervezaContenido.cervezasT.tipo}" />  
                           </p:column>  

                           <p:column headerText="Vaso" styleClass="barList23">  
                               <h:outputText value="#{cervezaContenido.vasosT.tipo}" />  
                           </p:column>  

                           <p:column headerText="Precio" styleClass="barList24">  
                               <h:outputText value="#{cervezaContenido.precio} €" />  
                           </p:column>  

                           <p:column headerText="Tapa"  styleClass="barList25">  
                               <h:outputText value="#{cervezaContenido.tapasCervezaT.nombre}" />  
                           </p:column>
                           <p:column>
                         
                               <p:commandButton id="botonEliminarCerveza" style="float:right" value="Eliminar" onclick="confirmation.show()"/>

                                <p:confirmDialog id="confirmDialog"
                                                 message="¿Está seguro de eliminar #{perfilEditarManagedBean.selectedCerveza.cervezasT.marca}/#{perfilEditarManagedBean.selectedCerveza.cervezasT.tipo} de su lista de cervezas?"  
                                                 header="Eliminar cerveza" severity="alert" widgetVar="confirmation">  
                                    <p:commandButton id="confirm" value="Eliminar" onclick="confirmation.hide();"
                                                     action="#{perfilEditarManagedBean.eliminarCerveza()}" update=":formListaCervezas:dataTableBarContenido,:formListaCervezas">
                                        <f:setPropertyActionListener value="#{cervezaContenido}"  
                                                                     target="#{perfilEditarManagedBean.selectedCerveza}" />
                                    </p:commandButton>
                                    <p:commandButton id="decline" value="Cancelar" onclick="confirmation.hide();" type="button"  />   

                                </p:confirmDialog>
                           </p:column>
                       </p:dataTable>
                        
                    </h:form>
                        <p:commandButton id="insertaCerveza" value="Agregar Cerveza" update="formAgregaCerveza" >
                            <f:setPropertyActionListener value="#{!perfilEditarManagedBean.renderTabla}"  
                                                         target="#{perfilEditarManagedBean.renderTabla}" />
                          
                        </p:commandButton>
                    
                        <h:form id="formAgregaCerveza">
                        
                        <p:messages id="messages5" showDetail="false" autoUpdate="true"/> 
                        <p:fieldset id="camposAgregaCerveza" legend="Datos Cerveza" rendered="#{perfilEditarManagedBean.renderTabla}"> 
                                   
                            <h:panelGrid id="tablaDatosCerveza" columns="2" cellpadding="5">   
                                       <h:outputText value="Marca:"/>
                                       <p:inputText id="marca" value="#{perfilEditarManagedBean.cerverzaT.marca}" autocomplete="false" 
                                                        required="true" requiredMessage="Se necesita la marca de la cerveza">
                                           </p:inputText>


                                       <h:outputText value="Tipo:"/>  
                                       <p:inputText  id="tipo" value="#{perfilEditarManagedBean.cerverzaT.tipo}"  autocomplete="false" 
                                                required="true" label="text" requiredMessage="Se necesita el tipo de cerveza"> 
                                           </p:inputText>


                                       
                                       <h:outputText value="Vaso:"/> 
                                       <p:selectOneListbox id="vasos" value="#{perfilEditarManagedBean.vasoT}" converter="vaso" var="v">  
                                           <f:selectItems  value="#{perfilEditarManagedBean.listaVasosT}" var="vaso" itemLabel="#{vaso.tipo}" itemValue="#{vaso}" />  

                                            <p:column>  
                                                <h:outputText value="#{v.tipo}"/>  
                                            </p:column>  
 
                                        </p:selectOneListbox>  
                                       

                                        <h:outputText value="Precio:"/>
                                        <p:inputText id="precio"  value="#{perfilEditarManagedBean.precio}" autocomplete="false" 
                                                required="true" label="text" requiredMessage="Se necesita el precio">
                                           </p:inputText>
                                        
                                        <h:outputText value="Tapa :"/>
                                        <p:inputText id="tapa"  value="#{perfilEditarManagedBean.tapaT.nombre}"  autocomplete="false"
                                                required="true" label="text" requiredMessage="Se necesita una tapa. Si no tiene tapa escribir 'Sin tapa'">
                                           </p:inputText>
                                        <h:outputText value="Descripción Tapa:"/>
                                        <p:inputText id="tapaDescripcion"  value="#{perfilEditarManagedBean.tapaT.descripcion}"  autocomplete="false"
                                                required="true" label="text" requiredMessage="Se necesita una descripción de la tapa. Si no tiene tapa escribir 'Sin descripción'">
                                           </p:inputText>


                                    </h:panelGrid>
                            
                            <div  class="buttonPerfil">
                                <h:form>
                                    <p:commandButton id="agregaCerveza" value="Agregar"  action="#{perfilEditarManagedBean.creaCerveza}" update=":formAgregaCerveza,:formListaCervezas:dataTableBarContenido, :formListaCervezas," >
                                        <f:setPropertyActionListener value="#{false}"  
                                                                 target="#{perfilEditarManagedBean.renderTabla}" />
                                    </p:commandButton>
                            
                                </h:form>
                            </div>
                        </p:fieldset>
                    </h:form>
                    
                </p:fieldset>
                
                <p:fieldset legend="Ofertas">
                    <h:form id="formListaOfertas" prependId="false" >
                        <p:dataTable id="dataTableBarOfertas" var="oferta" 
                                     value="#{perfilEditarManagedBean.listaOfertas}" 
                                     styleClass="listasCervezasTabla" paginator="true" rows="4"
                                     emptyMessage="No tiene publicada ninguna oferta." paginatorAlwaysVisible="false">
                           <p:column headerText="Descripción" styleClass="barList21">  
                               <h:outputText value="#{oferta.descripcion}"/>  
                           </p:column>
                            <p:column>
                         
                               <p:commandButton id="botonEliminarOferta" style="float:right" value="Eliminar" onclick="confirmationEliminar.show();"/>

                                <p:confirmDialog id="confirmDialogOferta"
                                                 message="¿Está seguro de eliminarla de su lista de ofertas?"  
                                                 header="Eliminar oferta" severity="alert" widgetVar="confirmationEliminar">  
                                    <p:commandButton id="confirmEliminarOferta" value="Eliminar" onclick="confirmationEliminar.hide();"
                                                     action="#{perfilEditarManagedBean.eliminarOferta()}" update=":formListaOfertas:dataTableBarOfertas,:formListaOfertas">
                                        <f:setPropertyActionListener value="#{oferta}"  
                                                                     target="#{perfilEditarManagedBean.selectedOferta}" />
                                    </p:commandButton>
                                    <p:commandButton id="declineEliminar" value="Cancelar" onclick="confirmationEliminar.hide();" type="button"  />   

                                </p:confirmDialog>
                           </p:column>


                       </p:dataTable>
                    </h:form>
                    <p:commandButton id="insertaOferta" value="Agregar Oferta" update="formAgregaOferta" >
                            <f:setPropertyActionListener value="#{!perfilEditarManagedBean.renderTabla2}"  
                                                         target="#{perfilEditarManagedBean.renderTabla2}" />
                          
                    </p:commandButton>
                    <h:form id="formAgregaOferta">
                        
                        <p:messages id="messages6" showDetail="false" autoUpdate="true"/> 
                        <p:fieldset id="camposAgregaOferta" legend="Datos Oferta" rendered="#{perfilEditarManagedBean.renderTabla2}"> 
                                   
                            <h:panelGrid id="tablaDatosOfertas" columns="2" cellpadding="5">   
                                       
                                        <h:outputText value="Descripción Oferta:"/>
                                        <p:inputText id="tapaDescripcion"  value="#{perfilEditarManagedBean.ofertaT.descripcion}"  autocomplete="false"
                                                required="true" label="text" requiredMessage="Se necesita una descripción de la oferta.">
                                        </p:inputText>

                            </h:panelGrid>
                            
                            <div  class="buttonPerfil">
                                <h:form>
                                    <p:commandButton id="agregaOferta" value="Agregar"  action="#{perfilEditarManagedBean.creaOferta}" update=":formAgregaOferta,:formAgregaOferta:tablaDatosOfertas, :formListaOfertas," >
                                        <f:setPropertyActionListener value="#{false}"  
                                                                 target="#{perfilEditarManagedBean.renderTabla2}" />
                                    </p:commandButton>
                                </h:form>
                           
                            </div>
                        </p:fieldset>
                    </h:form>
           
                </p:fieldset>
            </div>
        </div>
        <script src="js/classie.js"></script>
        <script src="js/menu.js"></script>
    </h:body>
</html>
